<!DOCTYPE html>
<html lang="en">
<head>
	<include data="head.html">
	<title>ModCMS 安装向导</title>
	<style>
	input{min-width: 300px !important;}
	.container{display: none;max-width: 540px;padding: 8px 10px 20px !important;}
	.page-header{border-bottom-color: #dedede;}
	.page-header>h1{margin-top: 0;font-size: 24px;}
	#install-database, #install-site, #install-finish{display: none;}
	#install-license>div:first-child{margin-top: 0;padding: 10px;border-left: 1px solid #dedede;border-right: 1px solid #dedede;}
	#install-license>div:first-child>div{max-height: 250px;}
	</style>
</head>
<body>
	<div class="container">
		<div class="page-header">
			<h1>ModCMS 安装向导 <small>{CMS_VERSION}</small></h1>
		</div>
		<if data="config('mod.installed')">
			<div class="install-container">
				<div class="settings-option">
					<p class="settings-desc">
						你已经在这个网站上安装了 ModCMS，请选择浏览网站首页或者登录。
					</p>
					<a role="button" href="{SITE_URL}" class="btn btn-default">网站首页</a>
				<a role="button" href="{admin_url('login.html')}" class="btn btn-default">登录</a>
				</div>
			</div>
			{!goto End;}
		</if>
		<div id="install-license" class="install-container">
			<div class="settings-option">
				<div id="license-content">
					{$license}
				</div>
			</div>
			<div class="settings-option">
				<p class="settings-desc">
					如果你同意上述协议，请点击下一步按钮。
				</p>
				<button type="button" data-target="install-database" class="btn btn-default">下一步</button>
			</div>
		</div>
		<div id="install-database"  class="install-container">
			<form id="database-form" action="" method="post">
				<div class="settings-option">
					<if data="$env">
						<p class="settings-desc">环境检测已通过，请继续进行安装。</p>
						<h4>数据库</h4>
						<div>
							<label for="mod-database-host">主机</label>
							<input type="text" class="form-control" id="mod-database-host" name="mod.database.host" value="{config('mod.database.host')}" placeholder="默认为 localhost" required/>
						</div>
						<div>
							<label for="mod-database-name">数据库名称</label>
							<input type="text" class="form-control" id="mod-database-name" name="mod.database.name" value="{config('mod.database.name')}" placeholder="默认为 modphp" required/>
						</div>
						<div>
							<label for="mod-database-port">端口</label>
							<input type="number" class="form-control" id="mod-database-port" name="mod.database.port" value="{config('mod.database.port')}" placeholder="默认为 3306" required/>
						</div>
						<div>
							<label for="mod-database-username">用户名</label>
							<input type="text" class="form-control" id="mod-database-username" name="mod.database.username" value="{config('mod.database.username')}" placeholder="登录数据库的用户名" required/>
						</div>
						<div>
							<label for="mod-database-password">密码</label>
							<input type="password" class="form-control" id="mod-database-password" name="mod.database.password" value="{config('mod.database.password')}" placeholder="与用户名对应的密码"/>
							<if data="!is_agent('Edge/14')">
								<i class="glyphicon glyphicon-eye-open"></i>
							</if>
						</div>
						<div>
							<label for="mod-database-prefix">表前缀</label>
							<input type="text" class="form-control" id="mod-database-prefix" name="mod.database.prefix" value="{config('mod.database.prefix')}" placeholder="区别同一数据库下不同网站的表"/>
						</div>
						<p class="settings-desc">
							请在上方填写你的数据库连接信息，如果不确定，请联系你的服务提供商。
						</p>
						<else>
							<p class="settings-desc">
								环境检测未通过，安装无法继续。原因：{$envWarning}
							</p>
							<p class="settings-desc">
								解决方案：{$envTip}
							</p>
						</else>
					</if>
				</div>
				<div class="settings-option">
					<p class="settings-desc">
						如果你确认上述信息已经填写无误，请点击下一步按钮。
					</p>
					<button type="button" class="btn btn-default" data-target="install-license">上一步</button>
					<button type="submit" data-target="install-site" class="btn btn-default{$env == false ? ' disabled' : ''}">下一步</button>
				</div>
			</form>
		</div>
		<div id="install-site" class="install-container">
			<form id="site-form" action="{SITE_URL}mod.php?mod::install" method="post">
				<div class="settings-option">
					<h4>网站</h4>
					<div>
						<label for="site-name">名称</label>
						<input type="text" class="form-control" id="site-name" name="site.name" value="{config('site.name')}" placeholder="网站主显示名称" required/>
					</div>
				</div>
				<div class="settings-option">
					<h4>管理员</h4>
					<div>
						<label for="user-name">用户名</label>
						<input type="text" class="form-control" id="user-name" name="user_name" value="" placeholder="用于登录和管理网站" required/>
					</div>
					<div>
						<label for="user-password">密码</label>
						<input type="password" class="form-control" id="user-password" name="user_password" value="" placeholder="与用户名对应的密码"/>
						<if data="!is_agent('Edge/14')">
							<i class="glyphicon glyphicon-eye-open"></i>
						</if>
					</div>
				</div>
				<div class="settings-option">
					<p class="settings-desc">
						如果你确认上述信息已经填写无误，请点击安装按钮并开始你的 ModCMS 之旅。
					</p>
					<button type="button" class="btn btn-default" data-target="install-database">上一步</button>
					<button type="submit" class="btn btn-default" data-loading-text="安装中...">安装</button>
				</div>
			</form>
		</div>
		<div id="install-finish">
			<div class="settings-option">
				<h4>安装完成！</h4>
				<div>
					<label>用户名</label>
					<span id="user-name-finish"></span>
				</div>
				<div>
					<label>密码</label>
					<span><i>你所设置的密码</i></span>
				</div>
			</div>
			<div class="settings-option">
				<p class="settings-desc">
					ModCMS 安装已经完成，你现在可以选择浏览网站首页或者登录。
				</p>
				<a role="button" href="{SITE_URL}" class="btn btn-default">网站首页</a>
				<a role="button" href="{admin_url('login.html')}" class="btn btn-default">登录</a>
			</div>
		</div>
		{!End:}
	</div>
	<include data="foot.html">
	<import data="js/jquery.centralize.js">
</body>
</html>